import React, { Component } from 'react';
import './App.css';

import {
    HashRouter,
    Route,
    Redirect,
    Switch,
} from 'react-router-dom'

import Side from './components/Sider'
import parKingManage from './components/parKingManage'
// import phone from './components/phone'
import suggestionBack from './components/suggestionBack.jsx'
import carManagement from './components/carManagement.jsx'
import AppManagement from './components/AppManagement.jsx'
import login from './components/login'
import FirstTop from './components/firstTop'
import appealMangement from './components/appealMangement.jsx'


import { Layout,Spin } from 'antd';
const {  Sider, Content } = Layout;

class App extends Component {
    render() {

        let LayOut =  (
            <div>
                <div id="spinContainer">
                    <Spin />
                </div>
                <Layout>
                    <Sider className="Sider">
                        <Side></Side>
                    </Sider>
                    <Layout>
                        <Content>
                            <div className="RouterBox">
                                <FirstTop></FirstTop>
                                <Switch>
                                    <Route path='/parKingManage' component={parKingManage}></Route>
                                    {/*<Route path='/phone' component={phone}></Route>*/}
                                    <Route path='/suggestionBack' component={suggestionBack}></Route>
                                    <Route path='/carManagement' component={carManagement}></Route>
                                    <Route path='/AppManagement' component={AppManagement}></Route>
                                    <Route path='/appealMangement' component={appealMangement}></Route>
                                    <Redirect to ="/parKingManage"></Redirect>
                                </Switch>
                            </div>
                        </Content>
                    </Layout>
                </Layout>
            </div>
        )

        return (
            <HashRouter>
                <div className="App">
                    <Switch>
                        <Route exact path="/" component={login} />
                        <Route  path="/" render={props=> LayOut}/>
                    </Switch>
                </div>
            </HashRouter>
        );
    }
}

export default App;
